<form class="page-wrap" method="post" action="./doc/json/ajaxDone.json" onsubmit="return false">
	<header>
		<div class="toolbar">
			<a class="bar-button back-button"><i class="dwz-icon-arrow-left"></i></a>
			<div class="header-title">表单提交 + 查找带回</div>
		</div>
	</header>

	<section>
		<div class="scroll-content dwz-scroll">
			<div class="scroll">
				<div class="form-content">
					<div class="divider"></div>

					<div class="form-item">
						<label>出差事由</label>
						<div class="item-content">
							<textarea class="textarea required" name="cause" rows="4" placeholder="请输入出差事由" maxlength="200" data-error="请输入出差事由"></textarea>
						</div>
					</div>

					<div class="divider"></div>

					<div class="form-item">
						<div class="item-content">
							<label>省市区</label>
							<input type="hidden" name="province" />
							<input type="hidden" name="city" />
							<input type="hidden" name="county" />
							<input type="text" name="destination" class="required" placeholder="省、市、区" data-error="请选择省市区" readonly onclick="$.dialog.open({
									url: 'tpl/helper/dialogSelectRegion.html?dwz_callback=biz.helper.selectRegionRender',
									data: {
										target:this,
										callback: function(data) {
											console.log(this, data);
											var form = this.parentsByTag('form').get(0);
											form.province.value = data[0].code;
											form.city.value = data[1].code;
											form.county.value = data[2].code;
											form.destination.value = data[2].names;

											$.dialog.close();
										}
									},
									pop: 'actionSheet'
								})" />
							<i class="dwz-icon-arrow-right"></i>
						</div>
					</div>
					<div class="form-item">
						<div class="item-content">
							<label>交通工具</label>
							<select name="traffic_vehicle" class="required" data-error="请选择交通工具">
								<option value="">请选择</option>
								<option value="1">飞机</option>
								<option value="2">火车</option>
								<option value="3">汽车</option>
								<option value="4">其它</option>
							</select>
						</div>
					</div>
					<div class="form-item">
						<div class="item-content">
							<label>单程往返</label>
							<select name="traffic_type" class="required" data-error="请选择单程往返">
								<option value="">请选择</option>
								<option value="1">单程</option>
								<option value="2">往返</option>
							</select>
						</div>
					</div>
					<div class="form-item">
						<div class="item-content">
							<label>开始时间</label>
							<input type="text" name="start_date" value="" minDate="%y-{%M-3}-%d" maxDate="%y-{%M+1}-%d" placeholder="请选择" class="required dwz-calendar" data-error="请选择开始时间" readonly />
						</div>
					</div>
					<div class="form-item">
						<div class="item-content">
							<label>结束时间</label>
							<input type="text" name="end_date" value="" minDate="%y-%M-%d" maxDate="%y-{%M+3}-%d" placeholder="请选择" class="required dwz-calendar" data-error="请选择结束时间" readonly />
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>出差天数</label>
							<input type="text" name="day" value="" placeholder="根据开始/结束时间自动计算" readonly />
						</div>
					</div>

					<div class="divider"></div>

					<div class="form-item">
						<div class="item-content">
							<label>同行人</label>
							<input type="hidden" name="together_id" />
							<input type="text" name="together_txt" value="" placeholder="请选择" class="required" readonly data-error="请选择同行人" onclick="$.filterPanel.open({
									url: 'tpl/helper/filterPanelLookup.html?dwz_callback=biz.helper.filterPanelRender',
									data: {
										target: this,
										searchTitle: '选择同行人',
										searchField: 'keywords',
										searchMethod: 'POST',
										searchUrl: biz.server.getUrl(biz.server.persionList),
										filterItems: [
											{
												name: 'type',
												value: 1
											},
											{
												label: '部门',
												name: 'department',
												options: DepartmentStore.data
											}
										],
										callback: function(data) {
											console.log(this, data)
											var form = this.parentsByTag('form').get(0);
											form.together_id.value = data.id;
											form.together_txt.value = data.name;
										}
									}
								})" />
							<i class="dwz-icon-arrow-right"></i>
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>手动输入</label>
							<input type="hidden" name="together2_id" />
							<input type="text" name="together2_txt" value="" placeholder="请选择" class="required" readonly data-error="请选择同行人" onclick="$.filterPanel.open({
									url: 'tpl/helper/filterPanelRadio.html?dwz_callback=biz.helper.filterPanelRender',
									data: {
										target: this,
										selectSearchField: true, // 选择输入框中的文字，默认为false
										searchTitle: '输入同行人',
										searchField: 'keywords',
										searchMethod: 'POST',
										searchUrl: biz.server.getUrl(biz.server.persionList),
										filterItems: [
											{
												name: 'type',
												value: 1
											}
										],
										callback: function(data) {
											console.log(this, data)
											var form = this.parentsByTag('form').get(0);
											form.together2_id.value = data[0].id;
											form.together2_txt.value = data[0].name;
										}
									}
								})" />
							<i class="dwz-icon-arrow-right"></i>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>

	<footer>
		<div class="form-bar padding-h">
			<button class="button primary" type="submit">提交</button>
		</div>
	</footer>
</form>

<script type="text/javascript">
	function helper(tpl, params) {
		// console.log(this, tpl, params)

		var $form = this.find('form.page-wrap');

		var $start_date = $form.find('input[name=start_date]'),
			$end_date = $form.find('input[name=end_date]'),
			$day = $form.find('input[name=day]');
		$start_date.add($end_date).change(function() {
			var day = biz.calDayRange({
				start: $start_date.val(),
				end: $end_date.val()
			});

			$day.val(day < 1 ? '' : day);
		});

		$form.on('submit', function() {
			if (!$form.valid()) {
				return false;
			}

			var day = biz.calDayRange({
				start: $start_date.val(),
				end: $end_date.val()
			});
			if (day < 1) {
				$.alert.error('开始时间不能大于结束时间');
				return;
			}

			return $.validateCallback($form, navViewAjaxDoneClose);
		});

		// $form.find('input[name=day]').removeAttr('readonly');
		// $form.find('input[name=day]').prop('readOnly', false);
	}
</script>